<template>
    <div class="doctor-card">
      <div class="card-item">
        <div class="card-title">今日新增预约</div>
        <div class="card-num">{{subCount}}</div>
      </div>
      <div class="card-item">
        <div class="card-title">今日病历书写</div>
        <div class="card-num">{{historyCount}}</div>
      </div>
      <!-- <div class="card-item">
        <div class="card-title">今日待完成任务</div>
        <div class="card-num">{{0}}</div>
      </div> -->
      <div class="card-item">
        <div class="card-title">今日回访人员</div>
        <div class="card-num">{{visitCount}}</div>
      </div>
      <!-- <div class="card-item">
        <div class="card-title">今日实收金额</div>
        <div class="card-num" v-if="isShow">{{'******'}}</div>
        <div class="card-num" >{{0}}</div>
      </div> -->
    </div>
    <div class="doctor" v-loading="loading">
      <!-- 今日就诊 -->
      <div class="record">
        <div class="doctor-search">
          <div class="text">今日就诊</div>
          <div class="date">
            <el-date-picker
              class="date-1"
              type="date"
              v-model="date"
              placeholder="选择日期"
              value-format="YYYY-MM-DD HH:mm:ss"
              @change="changeSearch"
              >
            </el-date-picker>
          </div>
          <div class="area">
            <el-input class="input-1" v-model="customerName" placeholder="患者/拼音/手机号/病历号"></el-input>
          </div>
          <div class="radio">

          </div>
          <div class="operation">
            <el-button class="btn-2" @click="refresh">刷新</el-button>
          </div>
        </div>
        <div class="doctor-table">
          <ztable 
              :tableData='data' 
              :strucs='doctorColumns'
              @goCharge="goCharge"
              @goMedical="goMedical"
              @goAppointment="goAppointment"
              @goReturnVisit="goReturnVisit"
              @overTreatment="overTreatment"
              @onToDetail="onToDetail"
            >
            </ztable>
        </div>
      </div>

      <!-- 今日回访 -->
      <div class="record">
        <div class="doctor-search">
          <div class="text">今日回访</div>
          <div class="date">
            <el-date-picker
              class="date-1"
              type="date"
              v-model="date"
              placeholder="选择日期"
              value-format="YYYY-MM-DD HH:mm:ss"
              @change="changeSearch"
              >
            </el-date-picker>
          </div>
          <div class="operation">
            <el-button class="btn-2" @click="refreshList">刷新</el-button>
          </div>
        </div>
        <div class="doctor-table">
          <ztable 
              :tableData='returnData' 
              :strucs='doctorVisitColumns'
              :isshowOperation="true"
              @onToDetail="onToDetail"
            >
            <template #default="slotScope">
              <el-button type="text" class="operation" 
                v-if="slotScope.rowData.status === '待处理'"
                @click="handleImplement(slotScope.rowData)"
                >执行</el-button>
              <el-button type="text" class="operation" 
                @click="handleEditItem(slotScope.rowData)"

                >修改</el-button>
              <!-- <el-button type="text" class="operation" >日志</el-button> -->
            </template>
            </ztable>
        </div>
      </div>
    </div>

    <!-- 新增/挂号/ 预约/  -->
  <el-drawer
			size="45%"
			:title="title"
			v-model="showDrawer"
			:before-close="drawerClose" destroy-on-close>
			<zaddpatient 
					@cancel="cancel" 
					@saveMakeAnAppointment="saveMakeAnAppointment" 
					@saveAndRegister="saveAndRegister"
					v-if="isADD === 'add'"
					></zaddpatient>
			
			<zregister v-if="isADD === 'register'"
				@cancel="cancel" 
				@handlebtn="handlebtn"
  
				></zregister>

			<zmakeanapp v-if="isADD === 'makeanapp'"
				@handlebtn="handlebtn"
				@cancel="cancel"
        @reloadList="reloadList"
        :makeanappInfo="makeanappInfo"

				></zmakeanapp>
	</el-drawer>

  <!-- 修改随访待处理，已完成 -->
    <zdrawer size="55%" @handleClose="drawer('修改随访')" :title="eidtTitle" v-model="editShowDrawer" >
      <template #body>
        <div class="drawer-main">
          <div class="drawer-info">
            <zswitchtabs :personID="PersonId"></zswitchtabs>
          </div>
          <div class="drawer-opration">
            <div class="drawer-content">
              <!-- 随访计划 -->
              
                <div class="callapse">
                <div class="show-head" @click="handleShow">
                  <span class="head-ctx">
                      <!-- <component :is="showWidget(item.type)"  v-for="item in firstThreeData" :key="item.name" :struc="item"  /> -->
                      <span class="name">{{personName}}</span>
                      <span class="sex">
                        <el-icon v-if="sex === '男'" class="male-color"><male /></el-icon>
                        <el-icon v-if="sex === '女'" class=" female-color"><female /></el-icon>
                        
                      </span>
                      <span>电话 {{mobileNum}}</span>
                  </span>
                  <span class="icon-btn">
                    <el-icon v-if="isShow"><arrow-right /></el-icon>
                    <el-icon v-else><ArrowDown /></el-icon>
                  </span>
                  
                </div>
                <div class="show-content" v-show="!isShow">
                  <!-- 有多条数据展开时 -->
                    
                    <div class="dynamic flexwrap">
                      <component :is="showWidget(item.type)"  v-for="item in registerAdd" :key="item.name" :struc="item"  />
                    </div>
                </div>
                </div>
              <!-- 执行 -->
                <div class="direct-implement">
                  <div class="flex-wrap">
                    <div class="leftToRight-layout">
                        <div class="label">
                          <span>随访医生</span>
                        </div>
                        <div class="operations">
                          <el-select  class="w-180" v-model="doctorId"  placeholder="请选择">
                            <el-option
                              v-for="item in doctorOptions"
                              :key="item.id"
                              :label="item.name"
                              :value="item.id">
                            </el-option>
                          </el-select>
                        </div>
                    </div>
                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>随访人员</span>
                      </div>
                      <div class="operations">
                        <el-select  class="w-180" v-model="dealUserId"  placeholder="请选择">
                          <el-option
                            v-for="item in dealUserOptions"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id">
                          </el-option>
                        </el-select>
                      </div>
                    </div>

                    <div class="leftToRight-layout" v-show='eidtTitle === "修改随访(待计划)"'>
                      <div class="label">
                        <span>咨询师</span>
                      </div>
                      <div class="operations">
                        <el-select v-model="consultantId" class="w-180"  placeholder="请选择">
                            <el-option
                              v-for="item in optionsSecondaryUser"
                              :key="item.id"
                              :label="item.name"
                              :value="item.id">
                            </el-option>
                          </el-select>
                      </div>
                    </div>
                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>{{eidtTitle === '修改随访(已完成)' ? '随访时间':'计划时间'}}</span>
                      </div>
                      <div class="operations">
                        <el-date-picker
                          type="date"
                          v-model="planTime"
                          @change="handleChangeDate"
                          >
                        </el-date-picker>
                      </div>
                    </div>
                    <div class="leftToRight-layout" v-show="eidtTitle === '修改随访(已完成)'">
                      <div class="label">
                        <span>联系方式</span>
                      </div>
                      <div class="operations">
                        <el-select  class="w-180" v-model="contactType"  placeholder="请选择">
                          <el-option
                            v-for="item in contactOptions"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id">
                          </el-option>
                        </el-select>
                      </div>
                    </div>
                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>随访内容</span>
                      </div>
                      <div class="operations">
                        <el-input
                            type="textarea"
                            :rows="4"
                            placeholder="请输入内容"
                            v-model="planContent"
                            >
                          </el-input>
                      </div>
                    </div>
                    <div class="leftToRight-layout" v-show="eidtTitle === '修改随访(已完成)'">
                      <div class="label">
                        <span>随访结果</span>
                      </div>
                      <div class="operations">
                        <el-input
                            type="textarea"
                            :rows="4"
                            v-model="backContent"
                            placeholder="随访结果"
                            >
                          </el-input>
                      </div>
                    </div>
                    <div class="leftToRight-layout" style="width: 100%;">
                      <div class="label">
                        <span>备注</span>
                      </div>
                      <div class="operations">
                        <el-input
                            type="textarea"
                            v-model="remark"
                            :rows="6"
                            >
                          </el-input>
                      </div>
                    </div>
                  </div>
                </div>
            </div>
          </div>
        </div>
      </template>
      <template #footer>
        <el-button class="btn-2" @click="drawer(eidtTitle)">取消</el-button>
        <el-button class="btn-1" @click="save(eidtTitle)">保存</el-button>
      </template>
    </zdrawer>

    <!-- 执行随访 -->
    <zdrawer size="55%" @handleClose="drawer('执行随访')" title="执行随访" v-model="showPerformDrawer" >
      <template #body>
        <div class="drawer-main">
          <div class="drawer-info">
            <zswitchtabs :personID="PersonId"></zswitchtabs>
          </div>
          <div class="drawer-opration">
            <div class="drawer-content">
              <!-- 随访计划 -->
                <div class="callapse">
                <div class="show-head" @click="handleShow">
                  <span class="head-ctx">
                      <!-- <component :is="showWidget(item.type)"  v-for="item in firstThreeData" :key="item.name" :struc="item"  /> -->
                      <span class="name">{{personName}}</span>
                      <span class="sex">
                        <el-icon v-if="sex === '男'" class="male-color"><male /></el-icon>
                        <el-icon v-if="sex === '女'" class=" female-color"><female /></el-icon>
                      </span>
                      <span>电话 {{mobileNum}}</span>
                  </span>
                  <span class="icon-btn">
                    <el-icon v-if="isShow"><arrow-right /></el-icon>
                    <el-icon v-else><ArrowDown /></el-icon>
                  </span>
                  
                </div>
                <div class="show-content" v-show="!isShow">
                  <!-- 有多条数据展开时 -->
                    
                    <div class="dynamic flexwrap">
                      <component :is="showWidget(item.type)"  v-for="item in registerAdd" :key="item.name" :struc="item"  />
                    </div>
                </div>
                </div>
              <!-- 执行 -->
                <div class="direct-implement">
                  <div class="flex-wrap">
                    <div class="leftToRight-layout">
                        <div class="label">
                          <span>创建人</span>
                        </div>
                        <div class="operations">
                          <span>{{createUserName || '暂无'}}</span>
                        </div>
                    </div>
                    <div class="leftToRight-layout">
                        <div class="label">
                          <span>创建时间</span>
                        </div>
                        <div class="operations">
                          <span>{{createTime || '暂无'}}</span>
                        </div>
                    </div>
                    <div class="leftToRight-layout">
                        <div class="label">
                          <span>随访医生</span>
                        </div>
                        <div class="operations">
                          <span>{{doctorName || '暂无'}}</span>
                          <!-- <el-select  class="w-180" v-model="doctorId"  placeholder="请选择">
                            <el-option
                              v-for="item in doctorOptions"
                              :key="item.id"
                              :label="item.name"
                              :value="item.id">
                            </el-option>
                          </el-select> -->
                        </div>
                    </div>
                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>随访人员</span>
                      </div>
                      <div class="operations">
                        <span>{{dealUserName || '暂无'}}</span>
                        <!-- <el-select  class="w-180" v-model="dealUserId"  placeholder="请选择">
                          <el-option
                            v-for="item in dealUserOptions"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id">
                          </el-option>
                        </el-select> -->
                      </div>
                    </div>

                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>咨询师</span>
                      </div>
                      <div class="operations">
                        <span>{{consultantName || '暂无'}}</span>
                        <!-- <el-select v-model="consultantId" class="w-180"  placeholder="请选择">
                            <el-option
                              v-for="item in optionsSecondaryUser"
                              :key="item.id"
                              :label="item.name"
                              :value="item.id">
                            </el-option>
                          </el-select> -->
                      </div>
                    </div>
                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>联系方式</span>
                      </div>
                      <div class="operations">
                        <el-select  class="w-180" v-model="contactType"  placeholder="请选择">
                          <el-option
                            v-for="item in contactOptions"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id">
                          </el-option>
                        </el-select>
                      </div>
                    </div>
                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>{{'计划时间'}}</span>
                      </div>
                      <div class="operations">
                        {{planTime}}
                        <!-- <el-date-picker
                          type="date"
                          v-model="planTime"
                          @change="handleChangeDate"
                          >
                        </el-date-picker> -->
                      </div>
                    </div>
                    <div class="leftToRight-layout">
                      <div class="label">
                        <span>随访内容</span>
                      </div>
                      <div class="operations">
                        <span>{{planContent || '暂无'}}</span>
                        <!-- <el-input
                            type="textarea"
                            :rows="4"
                            placeholder="请输入内容"
                            v-model="planContent"
                            >
                          </el-input> -->
                      </div>
                    </div>
                    <div class="leftToRight-layout" >
                      <div class="label">
                        <span>随访结果</span>
                      </div>
                      <div class="operations">
                        <el-input
                            type="textarea"
                            :rows="4"
                            v-model="backContent"
                            placeholder="随访结果"
                            >
                          </el-input>
                      </div>
                    </div>
                    <div class="leftToRight-layout" style="width: 100%;">
                      <div class="label">
                        <span>备注</span>
                      </div>
                      <div class="operations">
                        <el-input
                            type="textarea"
                            v-model="remark"
                            :rows="6"
                            >
                          </el-input>
                      </div>
                    </div>
                  </div>
                </div>
            </div>
          </div>
        </div>
      </template>
      <template #footer>
        <!-- <el-button class="btn-1" @click="revisit">再回访</el-button>
        <el-button class="btn-1" @click="cancelReturnVisit">取消本次回访</el-button> -->
        <el-button class="btn-2" @click="drawer('执行随访')">取消</el-button>
        <el-button class="btn-1" @click="save('执行随访')">保存</el-button>
      </template>
    </zdrawer>
</template>

<script lang="ts">
import { ArrowDown, ArrowRight, Male, Female } from '@element-plus/icons-vue'
import { defineComponent, ref, reactive, toRefs } from "@vue/runtime-core"
import useRequet, { RespData } from "../../hook/network"
import useShowWidget from "../../components/widget/usechoose";
import { debounce } from "../../utils/debounce"

import ztable from '@components/Table/index.vue'
import zdrawer from "../../components/drawer/drawer.vue"
import zswitchtabs from '../../components/switchTabs/switchTabs.vue'


import zmakeanapp from "../../components/patient/makeAnAppointment.vue"
import zaddpatient from "../../components/patient/add.vue"
import zregister from "../../components/patient/register.vue"


import { useRoute, useRouter } from "vue-router"

// 详情添加患者
import useSetAddLog from "../../hook/setAddLog"
import useRequest from "../../hook/request"
import useConfgin from '../../hook/getconfig'

import {Option} from "../../types"
import { getNowDate } from '../../utils/nowDate'
import { getAllUser, getConsultant, getAccessLogContactType } from "./../../usefn/getDoctor"
import { getTimeminute } from "../../usefn/getBirthday"


import { ElMessage, ElMessageBox } from 'element-plus'

const registerID = 523
// 列表
const configID = 530
// 回访列表
const configReturnID = 531
export default defineComponent({
  name: 'DoctorWork',
  components: {
    ztable,
    zdrawer,
    zswitchtabs,

    zmakeanapp,
    zaddpatient,
    zregister,

    ArrowDown, ArrowRight, Male, Female
  },
  setup() {
    const showWidget = useShowWidget;
    const router = useRouter()
    const request = useRequet({ path: "" });
    const data = ref([])
    const date = ref('')

    // 医生我的工作
    const { groupDataList } = useConfgin(configID)
    let doctorColumns = groupDataList.value
    // 回访
    const VisitColumns = useConfgin(configReturnID)
    let doctorVisitColumns = VisitColumns.groupDataList.value;
    const returnData = ref([]);
    let search = reactive({
      date: getNowDate(),
      name:'',
      current: 1,
      size: 100,
      total: 0,
      customerName: '',

      subCount: 0,
      historyCount: 0,
      visitCount: 0,

      loading: false,
    })

    // 我的工作上面的统计
    const getDoctorWorkCount = async() => {
      let result: any = await useRequest('sick/record/getDoctorWorkCount', {}, 'GET')
      console.log(result)
      let res = result.data;
      search.subCount = res.subCount;
      search.historyCount = res.historyCount;
      search.visitCount = res.visitCount;

    }
    getDoctorWorkCount()
    const getList = async() => {
      search.loading = true
      let params = {
        day: search.date,
        customerName: search.customerName,
        current: 1,
        size: 100,
      }
      let result: any = await useRequest('sick/record/getDoctorRecordDetailPage/', params, 'POST')
      console.log('执行了')
      data.value = result.data.records || [];
      data.value.forEach((i:any, index:number) => {
        i.startTime = getTimeminute(i.startTime)
        i.index = ++index
      })

      search.loading = false
    }


    getList()

    const debounceRefresh = debounce(getList, 1000)
    const refresh = () => {
      debounceRefresh()
    }

    const getReturnvisible = async() => {
      let params = {
        planDay: search.date
      }

      let result: any = await useRequest('sick/accessLog/getSelfVisitLogPage/', params, 'POST')
      console.log(result)
      if(result.code !== 0) return ElMessage.error('获取回访列表' + result.msg)
      returnData.value = result.data.records
    }

    getReturnvisible()

    const debounceRefreshList = debounce(getReturnvisible, 1000)
    const refreshList = () => {
      debounceRefreshList()
    }

    const changeSearch = (e: string) => {
      search.date = e
      getList()
      getReturnvisible()
    }

    const onToDetail = (id: number) => {
      useSetAddLog(id)
      router.push(`/allPatientDetails/${id}/patient`)
    }

    // 今日就诊操作
    const goCharge = (rowData: any) => {
      console.log(rowData)
      let id = rowData.customerId

      router.push({path:`/allPatientDetails/${id}/priceSet`, query: {type: 10}})
    }
    const goMedical = (rowData: any) => {
      console.log('病历')
      let id = rowData.customerId

      router.push({path:`/allPatientDetails/${id}/medicalRecord`, query: {type: 5}})
    }

    const goAppointment = (rowData:any) => {
      console.log('预约')
      console.log(rowData)
      let echoInfo = {
        id: rowData.id,
        customerId: rowData.customerId,
        customerName: rowData.customerName,
        clinicType: rowData.detailType,
        subscribeType: '',
        subscribeTime: '',
        timeLength: '',
        consultantId: '',
        departmentId: '',
        doctorId: rowData.masterUserId,
        nurseId: '',
        remark: '',
        itemIdsShow: [],
        clickType: '新建预约'
      }
      makeanappInfo.value = echoInfo
      showDrawer.value = true
      title.value = "新建预约"
      isADD.value = 'makeanapp'
    }

    const goReturnVisit = (rowData:any) => {
      console.log('回访')
      // 这里跳随访（回访本质就是随访）
      let id = rowData.customerId
      useSetAddLog(id)
      
      router.push({path:`/allPatientDetails/${id}/followUp`, query: {type: 7}})
    }

    // 治疗结束
    const overTreatment = (RowData: any, val: string) => {
      console.log(RowData)
      let id = RowData.id
      let name = RowData.customerName

      let params = {
        id: id,
        toStatus: val
      }
      console.log(RowData, val)
      ElMessageBox.confirm(`确定患者【${name}】,已完成治疗么?`, '确定', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(async() => {
				
        await useRequest('sick/record/detailToStatus', params, 'POST')
        await getList()
			}).catch(() => {
					ElMessage({
						type: 'info',
						message: '已取消',
					});
      })
      
    }

    const makeanappInfo = ref({} as any)

    // 刷新列表
    const reloadList = () => {
      console.log('执行')
      getList()
    }
    // 抽屉 --》 新建预约部分
    const showDrawer = ref(false)
    const title = ref('')
    const isADD = ref('')
    // 打开新建预约
    const saveMakeAnAppointment = () => {
      isADD.value = 'makeanapp'
			title.value = "新建预约"
    }

    const saveAndRegister = () => {
			isADD.value = 'register'
			title.value = "挂号"
		}


    const handlebtn = () => {
      isADD.value = 'add'
			title.value = "个人信息"
    }
    const drawerClose = () => {
      ElMessageBox.confirm('此操作将关闭窗口, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
				showDrawer.value = false
			}).catch(() => {
					ElMessage({
						type: 'info',
						message: '已取消',
					});
      })
    }
    const cancel = () => {
      showDrawer.value = false
    }


    
    //  抽屉
    const drawerData = reactive({
      eidtTitle: '修改随访(已完成)',
      editShowDrawer: false,
      showPerformDrawer: false,

      doctorId: null,
      dealUserId: null,
      consultantId: null,
      planTime: '',
      contactType: '',
      planContent: '',
      backContent: '',
      remark: '',
      doctorOptions:[] as Option[],
      optionsSecondaryUser: [] as Option[],
      dealUserOptions: [] as Option[],
      contactOptions: [] as Option[],

      createUserName: '',
      createTime: '',
      doctorName: '',
      dealUserName: '',
      consultantName: '',
    })

    // 得到所有用户 / 咨询师 / 联系方式
    const getDealUserOptions = async() => {
      try{
        drawerData.dealUserOptions = await getAllUser()
        drawerData.optionsSecondaryUser = await getConsultant()
        drawerData.contactOptions = await getAccessLogContactType()
      } catch(e) {
        throw e
      }
      
    }
    getDealUserOptions()

    const drawer = (type: string) => {
      ElMessageBox.confirm('此操作将关闭窗口, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        
        if(type === '执行随访') {
          drawerData.showPerformDrawer = false
        }
        drawerData.editShowDrawer = false
			}).catch(() => {
					ElMessage({
						type: 'info',
						message: '已取消',
					});
      })
      
      
    }

    const isShow = ref(false)
    const sex = ref('')
    const mobileNum = ref('')
    const personName = ref('')
    const followId = ref()
    const PersonId = ref<any>()

    const registerinfo = useConfgin(registerID)
    const registerAdd = registerinfo.groupDataAdd

    const handleShow = () => {
      console.log('点击了')
      isShow.value = !isShow.value
    }

    const handleChangeDate = (e: Date, index = -1) => {
        drawerData.planTime = getNowDate(e)
    }

    // 获取患者信息
    const getPersonInfo = (id: number) => {
      request.sendRequest({
        address: `customer/info/getCustomerInfo/${id}`,
        params: {},
        success: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error(resp.msg || '获取信息失败')
          let list = resp.data
          sex.value = list.gender
          let doctorId = resp.data.lastDoctorId || ''
            window.localStorage.setItem('doctorId', doctorId)
          personName.value = list.name
          mobileNum.value = list.mobileNum
          registerAdd.value.forEach(item => {
            item.value = list[item.name]
          })
        },
        fail: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error(resp.msg)
          
        },
        method: "GET",
      })
    }

    const getDoctorAndNurse = () => {
      // 获取医生
      request.sendRequest({
        address: 'company/user/user/getDoctorUserByStatus',
        params: {
          name: ''
        },
        success: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error(resp.msg || '获取信息失败')
          console.log(resp.data)
          drawerData.doctorOptions = resp.data
        },
        fail: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error(resp.msg)
          
        },
        method: "POST",
      }) 
    }

    // 修改随访回显数据
    const eidtEchoData = (id: number) => {
      request.sendRequest({
        address: `sick/accessLog/getAccessLogById/${id}`,
        params: {},
        success: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error(resp.msg || '获取信息失败')
          console.log('修改', resp.data)
          let data = resp.data
          drawerData.doctorId = data.doctorId
          drawerData.dealUserId = data.dealUserId
          drawerData.consultantId = data.consultantId
          drawerData.planTime = data.planTime
          drawerData.planContent = data.planContent
          drawerData.remark = data.remark
          drawerData.contactType = data.contactType
          drawerData.backContent = data.backContent

          drawerData.createUserName = data.createUserName
          drawerData.createTime = data.createTime
          drawerData.doctorName = data.doctorName
          drawerData.dealUserName = data.dealUserName
          drawerData.consultantName = data.consultantName
        },
        fail: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error(resp.msg)
          
        },
        method: "GET",
      }) 
    }

      // 重置计划
    const resetPlan = () => {
      drawerData.doctorId = null,
      drawerData.dealUserId = null,
      drawerData.consultantId = null,
      drawerData.planTime = '',
      drawerData.planContent = '',
      drawerData.remark = '',
      drawerData.contactType = '',
      drawerData.backContent = '',

      // 执行随访展示
      drawerData.createUserName = '',
      drawerData.createTime = '',
      drawerData.doctorName = '',
      drawerData.dealUserName = '',
      drawerData.consultantName = ''
    }

    // 执行
    const handleImplement = (rowData: any) => {
      let { id, customerId } = rowData
      PersonId.value = customerId
      followId.value = rowData.id
      getPersonInfo(customerId)
      eidtEchoData(id)
      drawerData.showPerformDrawer = true
    }
    // 修改(完成、待计划)
    const handleEditItem = (rowData: any) => {
      let { id, customerId } = rowData
      PersonId.value = customerId
      followId.value = id
      getPersonInfo(customerId)
      eidtEchoData(id)
      getDoctorAndNurse()
      console.log(rowData.status)
      if(rowData.status === '待处理') {
        drawerData.eidtTitle = '修改随访(待计划)'
      }
      if(rowData.status === '完成') {
        drawerData.eidtTitle = '修改随访(已完成)'
      }
      drawerData.editShowDrawer = true
    }

    // 保存
    const save = (type: string) => {
      if(type === '执行随访') {

        handleFollow()
      }

      console.log(type)
      if(type === '修改随访(已完成)') {
        
        eidtOver()
      }

      if(type === '修改随访(待计划)') {
        eidtHandle()
      }
    } 

      // 修改随访(已完成) 
    const eidtOver = () => {
      request.sendRequest({
          address: 'sick/accessLog/updateCompleteFollowAccessLog',
          params: {
            id: followId.value,
            doctorId: drawerData.doctorId,
            dealUserId: drawerData.dealUserId,
            planTime: drawerData.planTime,
            planContent: drawerData.planContent,
            remark: drawerData.remark,
            contactType: drawerData.contactType,
            backContent: drawerData.backContent
          },
          success: (resp: RespData) => {
            if(resp.code !== 0) return ElMessage.error(resp.msg || '获取信息失败')
            console.log(resp.data)
            ElMessage.success('修改随访成功')
            resetPlan()
            getReturnvisible()
            drawerData.editShowDrawer = false
          },
          fail: (resp: RespData) => {
            if(resp.code !== 0) return ElMessage.error(resp.msg)
            
          },
          method: "POST",
        })
    }

    // 修改随访(待处理) 未完成
    const eidtHandle = () => {
      request.sendRequest({
          address: 'sick/accessLog/updateCompleteFollowAccessPlan',
          params: {
            id: followId.value,
            doctorId: drawerData.doctorId,
            dealUserId: drawerData.dealUserId,
            consultantId: drawerData.consultantId,
            planTime: drawerData.planTime,
            planContent: drawerData.planContent,
            remark: drawerData.remark,
          },
          success: (resp: RespData) => {
            if(resp.code !== 0) return ElMessage.error(resp.msg || '获取信息失败')
            console.log(resp.data)
            ElMessage.success('修改随访成功')
            resetPlan()
            getReturnvisible()
            drawerData.editShowDrawer = false
          },
          fail: (resp: RespData) => {
            if(resp.code !== 0) return ElMessage.error(resp.msg)
            
          },
          method: "POST",
        })
    }
    
    
    // 执行随访
    const handleFollow = () => {
      request.sendRequest({
        address: 'sick/accessLog/completeAccessLog',
        params: {
          id: followId.value,
          backContent: drawerData.backContent,
          remark: drawerData.remark,
          contactType: drawerData.contactType,
        },
        success: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error('执行随访' + resp.msg)
          ElMessage.success('执行随访成功')
          drawerData.showPerformDrawer = false
          resetPlan()
          getReturnvisible()
        },
        fail: (resp: RespData) => {
          if(resp.code !== 0) return ElMessage.error('执行随访' + resp.msg)
        },
        method: "POST",
      })
    }


    return {
      ...toRefs(search),
      // date,
      doctorColumns,
      doctorVisitColumns,
      data,
      returnData,
      request,

      PersonId,

      goCharge,
      goMedical,
      goAppointment,
      goReturnVisit,
      overTreatment,
      refresh,
      onToDetail,
      changeSearch,
      refreshList,

      showDrawer,
      title,
      isADD,
      saveMakeAnAppointment,
      saveAndRegister,
      handlebtn,
      drawerClose,
      cancel,
      reloadList,
      makeanappInfo,

      ...toRefs(drawerData),
      drawer,
      handleShow,
      showWidget,
      handleChangeDate,
      isShow,
      followId,
      sex,
      personName,
      mobileNum,
      registerinfo,
      registerAdd,
      handleImplement,
      handleEditItem,
      save,
    }
  }
})
</script>

<style lang="scss" scoped>
@import '../../style/followrtyle.scss';
.doctor-card {
  width: 100%;
  height: 14%;
  // background: red;
  margin-bottom: 20px;
  display: flex;

  .card-item {
    width: 220px;
    height: 100%;
    background: #5077e7;
    color: white;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    margin-right: 30px;
    background-image: url('../../assets/image/d-1.png');
    background-repeat: no-repeat;
    background-size: 80px 80px;
    background-position: top 100% right;

    .card-title {
      padding-left: 20px;
      font-size: 22px;
    }

    .card-num {
      padding-left: 20px;
      font-weight: 600;
      font-size: 20px;
    }
  }

  .card-item:nth-child(2) {
    background: #2190de;
    background-image: url('../../assets/image/d-2.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: top 100% right;
  }
  .card-item:nth-child(3) {
    background: #21b8de;
    background-image: url('../../assets/image/d-3.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: top 100% right;
  } 
  .card-item:nth-child(4) {
    background: #21dcde;
    background-image: url('../../assets/image/d-4.png');
    background-repeat: no-repeat;
    background-size: 80px 80px;
    background-position: top 100% right;
  }
  .card-item:nth-child(5) {
    background: #00e2a5;
    background-image: url('../../assets/image/d-5.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: top 100% right;
  }
}

.doctor {
  width: 100%;
  // height: calc(100% - 15%);
  background: white;

  .record {
    .doctor-search {
      height: 45px;
      line-height: 45px;
      background: $mainColor;
      display: flex;
      padding: 0 20px;

      .text {
        color: white;
        font-weight: 600;
      }

      .date {
        padding: 0 10px;
      }

      .area {
        padding-right: 10px;
      }

      .operation {

        .operation-btn {
          min-width: 60px;
          height: 30px;
          min-height: 30px;
          line-height: 0;
          border-radius: $radius-1;
        }
      }
    }

    .doctor-table {
      padding: 10px 20px;
    }
  }
}
</style>